<%@ taglib uri="/struts-tags" prefix="s"%>
<html>
<head>
<script type="text/javascript">
	$(function() {

		$("#addContact").click(function(event) {
			event.preventDefault();
			$("#addClientdiv").slideToggle();
		});

		$("#addClientdiv a").click(function(event) {
			event.preventDefault();
			$("#addClientdiv").slideUp();
		});
	});
</script>
<style type="text/css">
a {
	color: #993300;
	text-decoration: none;
}

#addClientdiv {
	width: 100%;
	display: none;
	padding: 5px;
	border: 2px solid #000;
	background-color: #fff;
}

#mostrar {
	display: block;
	width: 100%;
	padding: 5px;
	border: 2px solid #D0E8F4;
	background-color: #ECF8FD;
}
</style>
</head>
<body>
	<table id="grid-selection"
		class="table table-condensed table-hover table-striped">
		<thead>
			<tr>
				<th data-column-id="fullName">Full Name</th>
				<th data-column-id="position">Position</th>
				<th data-column-id="company">Company</th>
				<th data-column-id="email">Email</th>
				<th data-column-id="phone">Phone</th>
				<th data-column-id="ext">Ext.</th>
				<th data-column-id="mobile">Mobile</th>
				<th data-column-id="action">Action</th>
			</tr>
		</thead>

		<tbody>
			<s:iterator value="contactsCop">
				<tr>
					<td><s:property value="name" /></td>
					<td><s:property value="position" /></td>
					<td><s:property value="company" /></td>
					<td><s:property value="email" /></td>
					<td><s:property value="phone" /></td>
					<td><s:property value="ext" /></td>
					<td><s:property value="mobile" /></td>
					<td><s:if test="%{#session.usuarioSession.cop == true}">
					<button type="submit" class="center button default"
									onclick='eliminaContacCop("<s:property value="id" />");'>
									Eliminar</button>
<%-- 							<s:a action="EliminaPTListCopImp" cssClass="button default" --%>
<%-- 								method="removeContact"> --%>
<%-- 								<s:text name="Eliminar" /> --%>
<%-- 								<s:param name="exportar" value="false" /> --%>
<%-- 								<s:param value="id" --%>
<%-- 									name="detallesContactsList[%{#rowstatus.index}].id" /> --%>
<%-- 								<s:param value="%{#rowstatus.index}" name="index" /> --%>
<%-- 							</s:a> --%>
						</s:if></td>
				</tr>

			</s:iterator>



		</tbody>

		
	</table>
	<div>
		<button type="submit" id="addContact" class="center btn btn-primary">Add Contact</button>
	</div>
	<div id="addClientdiv">
		<a href="#" class="close">[x]</a>

		<div class="form-group">
			<label for="exampleInputEmail1">Name</label> <input type="text"
				class="form-control" id="inputName" >
		</div>
		<div class="form-group">
			<label for="exampleInputPassword1">Position</label> <input
				type="text" class="form-control" id="inputPosition">
		</div>
		<div class="form-group">
			<label for="exampleInputPassword1">Company</label> <input
				type="text" class="form-control" id="inputCompany">
		</div>

		<div class="form-group">
			<label for="exampleInputPassword1">Email</label> <input
				type="text" class="form-control" id="inputEmail">
		</div>
		<div class="form-group">
			<label for="exampleInputPassword1">Phone</label> <input
				type="text" class="form-control" id="inputPhone">
		</div>
		<div class="form-group">
			<label for="exampleInputPassword1">Ext</label> <input
				type="text" class="form-control" id="inputExt">
		</div>
		<div class="form-group">
			<label for="exampleInputPassword1">Mobile</label> <input
				type="text" class="form-control" id="inputMobile">
		</div>
	
	
		<button type="submit" class="btn btn-default" onclick="agregaContact();">Add</button>

	</div>


	<!-- 	<div id="addContact"  style="display: none;"> -->

	<!-- 		<div class="form-group"> -->
	<!-- 			<label for="inputBF">Full Name</label> <input type="text" -->
	<!-- 				class="form-control" id="inputBF" placeholder="Enter Full Name"> -->
	<!-- 		</div> -->
	<!-- 		<div class="form-group"> -->
	<!-- 			<label for="inputName">Name</label> <input type="text" -->
	<!-- 				class="form-control" id="inputName" placeholder="Enter Name"> -->
	<!-- 		</div> -->
	<!-- 		<div class="form-group"> -->
	<!-- 			<label for="inputEmail">Email</label> <input type="email" -->
	<!-- 				class="form-control" id="inputEmail" placeholder="Enter Email"> -->
	<!-- 		</div> -->
	<!-- 		<div class="form-group"> -->
	<!-- 			<label for="inputTelephone">Telephone</label> <input type="text" -->
	<!-- 				class="form-control" id="inputTelephone" -->
	<!-- 				placeholder="Enter Telephone"> -->
	<!-- 		</div> -->


	<!-- 		<button type="submit" id="submitNewP" class="btn btn-default" -->
	<!-- 			onclick="insertNewPerson();">Submit</button> -->

	<!-- 	</div> -->


</body>
</html>